<?php
/**
 * Created by PhpStorm.
 * User: wuchunyin
 * Date: 2018/11/15
 * Time: 16:13
 */

namespace app\index\ui;

class Form {

    static public function form($type,$config){
        if($type == 'text'){
            return self::text($config);
        }
        if($type == 'date'){
            return self::date($config);
        }
        if($type == 'depart'){
            return DepartSelect::html($config);
        }
        if($type == 'select'){
            return self::select($config);
        }
        if($type == 'select2'){
            return self::select2($config);
        }
    }

    static public function text($config){
        $title = isset($config['title'])?$config['title']:'';
        $name = isset($config['name'])?$config['name']:'';
        $value = isset($config['value'])?$config['value']:'';
        $mist = isset($config['mist'])?$config['mist']:'';
        $col = isset($config['col'])?$config['col']:'col-sm-6 col-md-6 col-lg-4';
        $disable = isset($config['disable'])?$config['disable']:'';
        $readonly = isset($config['readonly'])?$config['readonly']:'';
        $pl = isset($config['pl'])?$config['pl']:'';

        $html = <<<EOF
                    <div class="$col" style="padding-top:4px;padding-bottom: 4px;">
                        <div class="input-group" style="width: 100%;">
                            <span class="input-group-addon" style="width: 100px;text-align: right">
                                <span style="color:red">$mist</span>
                                $title
                            </span>
                            <input name="$name" $disable $readonly value="$value" placeholder="$pl" type="text" class="form-control">
                        </div>
                    </div>
EOF;
        return $html;
    }

    static public function date($config){
        $title = isset($config['title'])?$config['title']:'';
        $name = isset($config['name'])?$config['name']:'';
        $value = isset($config['value'])?$config['value']:'';
        $mist = isset($config['mist'])?$config['mist']:'';
        $col = isset($config['col'])?$config['col']:'col-sm-6 col-md-6 col-lg-4';
        $pl = isset($config['pl'])?$config['pl']:'';

        $html = <<<EOF
                    <div class="$col" style="padding-top:4px;padding-bottom: 4px;">
                        <div class="input-group" style="width: 100%;">
                            <span class="input-group-addon" style="width: 100px;text-align: right">
                                <span style="color:red">$mist</span>
                                $title
                            </span>
                            <input name="$name" value="$value" placeholder="$pl" style="background-color: white" type="text" class="form-control">
                        </div>
                    </div>
<script>
    $(function() {
        $("[name='$name']").flatpickr();
    });
</script>
EOF;
        return $html;
    }

    static public function select($config){

        $title = isset($config['title'])?$config['title']:'';
        $name = isset($config['name'])?$config['name']:'';
        $value = isset($config['value'])?$config['value']:'';
        $list = isset($config['list'])?$config['list']:[];
        $key = isset($config['key'])?$config['key']:'ID';
        $field = isset($config['field'])?$config['field']:'NAME';
        $mist = isset($config['mist'])?$config['mist']:'';
        $col = isset($config['col'])?$config['col']:'col-sm-6 col-md-6 col-lg-4';
        $disable = isset($config['disable'])?$config['disable']:'';

        $options = "<option value='' style='display: none'>请选择...</option>";
        foreach ($list as $data){
            if($data[$key] == $value){
                $options .= '<option value="'.$data[$key].'" selected>'.$data[$field].'</option>';
            }
            else{
                $options .= '<option value="'.$data[$key].'">'.$data[$field].'</option>';
            }
        }

        $html = <<<EOF
                <div class="$col" style="padding-top: 4px;padding-bottom: 4px;">
                    <div class="input-group" style="width: 100%;">
                        <span class="input-group-addon" style="width: 100px;text-align: right"><span style="color:red">$mist</span>$title</span>
                        <select name="$name" $disable class="form-control">
                        $options
                        </select>
                    </div>
                </div>
EOF;
        return $html;
    }

    static public function select2($config){

        $title = isset($config['title'])?$config['title']:'';
        $name = isset($config['name'])?$config['name']:'';
        $value = isset($config['value'])?$config['value']:'';
        $s_url = isset($config['url'])?$config['url']:'';
        $url = url($s_url);
        $s_key = isset($config['key'])?$config['key']:'ID';
        $s_field = isset($config['field'])?$config['field']:'NAME';
        $mist = isset($config['mist'])?$config['mist']:'';
        $col = isset($config['col'])?$config['col']:'col-sm-6 col-md-6 col-lg-4';
        $disable = isset($config['disabled'])?$config['disabled']:'';

        $options = "<option value='' style='display: none'>加载中....</option>";

        $html = <<<EOF
                <div class="$col" style="padding-top: 4px;padding-bottom: 4px;">
                    <div class="input-group" style="width: 100%;">
                        <span class="input-group-addon" style="width: 100px;text-align: right"><span style="color:red">$mist</span>$title</span>
                        <select name="$name" $disable class="form-control">
                        $options
                        </select>
                    </div>
                </div>
<script>
    $(function() {
        $.ajax({
            url:"$url",
            type:'post',
            success:function(data) {
                var isSelect = false;
                $("[name='$name']").empty();
                var opt = '<option value="" style="display: none">请选择....</option>';
                $("[name='$name']").append(opt);
                console.log(data);
                for(var i = 0 ; i < data.length ; i++){
                    var option = "<option value='" + data[i]["$s_key"] + "'>"
                    + data[i]["$s_key"] + ":" + data[i]["$s_field"] + "</option>";
                    $("[name='$name']").append(option);
                    if("$value" == data[i]["$s_key"]){
                        isSelect = true;    
                    }
                }
                if(isSelect){
                    $("[name='$name']").val("$value");
                }
            },
            error:function(res) {
                layer.alert("获取[$title]数据失败",{icon:2});
            }
        });
    });
</script>
EOF;
        return $html;
    }


}